<style>
    #download {  width: 56px;display: inline-block;padding: 5px;border-radius: 5px;text-align: center;background-color: #179B16;color: white;}
    .btn-box{display: none; position: absolute;left: 0;right: 0;background-color: #179B16; color: white; z-index: 999999}
    .btn-box a{display: block; padding: 5px; color: white;}
    .btn-box a:hover {background-color: #2d6987;}
    #download:hover .btn-box{display: block;}
    .selected {background-color: #9ed99d;}
</style>
<div class="posts-manage-wrapper">
    <div class="operating" style="border-top: 2px solid #57a957; padding: 15px;border-bottom: 2px solid #57a957; font-size: 13px; ">
        <a id="week" href="javascript:void (0)" class="weui-btn weui-btn_mini weui-btn_primary" style="vertical-align: middle">一周</a>
        <a id="month" href="javascript:void (0)" class="weui-btn weui-btn_mini weui-btn_primary" style="vertical-align: middle">一个月</a>
        <label style="vertical-align: middle">请选择时间</label>
        <input type="date" id="start">到
        <input type="date" id="end">
        <a href="javascript:void (0)" style="vertical-align: middle" class="weui-btn weui-btn_mini weui-btn_primary" id="submit">查询</a>
        <li href="javascript:void (0)" style="vertical-align: middle; position: relative" class="" id="download">
            下载
            <ul class="btn-box">
                <li><a href="javascript:void (0)" id="utf" data-type="utf-8">UTF-8</a></li>
                <li><a href="javascript:void (0)" id="gbk" data-type="gbk">GBK2312</a></li>
            </ul>
        </li>
    </div>
    <div id="amount" style="width: 950px;height:400px;"></div>
    <div id="browse" style="width: 950px;height:400px;"></div>
    <div id="reply_amount" style="width: 950px;height:400px;"></div>
</div>

<sss>
    function createEcharts(data, date, title, el, name) {
        var elDom;
        elDom = echarts.init(document.getElementById(el));
        var option = {
            title: {
                text: title
            },
            tooltip: {
                trigger: 'axis'
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: date
            },
            yAxis: {
                type: 'value'
            },
            series: [
                {
                    name: name,
                    type:'line',
                    data:data
                }
            ]
        };
        elDom.setOption(option)
    };
    (function (w, u) {
        var sDate = new Date();
        var eDate = new Date();
        sDate.setDate(sDate.getDate() -6);
        var startTime = sDate.getFullYear() + '-' + (sDate.getMonth() + 1) + '-' + sDate.getDate();
        var endTime = eDate.getFullYear() + '-' + (eDate.getMonth() + 1) + '-' + eDate.getDate();
        $.ajax({
            url: 'http://api.hongyanche.com/forum_admin/dataAnalysis',
            type: 'POST',
            data: {
                start: startTime,
                end: endTime
            },
    xhrFields:{
    withCredentials:true
    },
            success: function (data) {
                var amount = data.data.info.amount;
                var browse = data.data.info.browse;
                var replyAmount = data.data.info.reply_amount;
                var date = data.data.info.day;
                createEcharts(amount, date, '一周发帖量','amount', '发帖');
                createEcharts(browse, date, '一周浏览量', 'browse', '浏览');
                createEcharts(replyAmount, date, '一周回复量', 'reply_amount', '回复');
            }
        });
        //
        $('.operating').on('click', '#month', function () {
            $('.selected').removeClass('selected');
            $(this).addClass('selected');
            var date = new Date();
            var end = new Date();
            date.setDate(date.getDate() - 29);
            var startTime = date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
            var endTime = end.getFullYear() + '-' + (end.getMonth() + 1) + '-' + end.getDate();
            $.ajax({
                url: 'http://api.hongyanche.com/forum_admin/dataAnalysis',
                type: 'POST',
                data: {
                    start: startTime,
                    end: endTime
                },
    xhrFields:{
    withCredentials:true
    },
                success: function (data) {
                    var amount = data.data.info.amount;
                    var browse = data.data.info.browse;
                    var replyAmount = data.data.info.reply_amount;
                    var date = data.data.info.day;
                    createEcharts(amount, date, '一月发帖量','amount', '发帖');
                    createEcharts(browse, date, '一月浏览量', 'browse', '浏览');
                    createEcharts(replyAmount, date, '一月回复量', 'reply_amount', '回复');
                }
            })
        });

        $('.operating').on('click', '#week', function () {
            $('.selected').removeClass('selected');
            $(this).addClass('selected');
            var sDate = new Date();
            var eDate = new Date();
            sDate.setDate(sDate.getDate() -6);
            var startTime = sDate.getFullYear() + '-' + (sDate.getMonth() + 1) + '-' + sDate.getDate();
            var endTime = eDate.getFullYear() + '-' + (eDate.getMonth() + 1) + '-' + eDate.getDate();
            $.ajax({
                url: 'http://api.hongyanche.com/forum_admin/dataAnalysis',
                type: 'POST',
                data: {
                    start: startTime,
                    end: endTime
                },
    xhrFields:{
    withCredentials:true
    },
                success: function (data) {
                    var amount = data.data.info.amount;
                    var browse = data.data.info.browse;
                    var replyAmount = data.data.info.reply_amount;
                    var date = data.data.info.day;
                    createEcharts(amount, date, '一周发帖量','amount', '发帖');
                    createEcharts(browse, date, '一周浏览量', 'browse', '浏览');
                    createEcharts(replyAmount, date, '一周回复量', 'reply_amount', '回复');
                }
            });
        });

        $('.operating').on('click','#submit' ,function () {
            $('.selected').removeClass('selected');
            $(this).addClass('selected');
            var startTime = $('#start').val();
            var endTime = $('#end').val();
            $.ajax({
                url: 'http://api.hongyanche.com/forum_admin/dataAnalysis',
                type: 'POST',
                data: {
                    start: startTime,
                    end: endTime
                },
                success: function (data) {
                    var amount = data.data.info.amount;
                    var browse = data.data.info.browse;
                    var replyAmount = data.data.info.reply_amount;
                    var date = data.data.info.day;
                    createEcharts(amount, date, '发帖量','amount', '发帖');
                    createEcharts(browse, date, '浏览量', 'browse', '浏览');
                    createEcharts(replyAmount, date, '回复量', 'reply_amount', '回复');
                }
            });
        });
        
        function getDaysMonth(y, m) {
            parseInt(month, 10);
            var d= new Date(y, m+1, 0);
            return d.getDate();
        };
        $('.operating').on('click', '#utf', function () {
            var type = $(this).attr('data-type');
            var klass = $('.selected').attr('id');
            if (klass == 'week') {
                w.location.href = '/forum_admin/donwload?code='+ type + '&start=0';
                return;
            }
            if (klass == 'month') {
                var date = new Date();
                var y = date.getFullYear();
                var m = date.getMonth();
                var d = getDaysMonth(y, m);
                w.location.href = '/forum_admin/donwload?code=' + type + '&start=' + y+'-' +m +'-' +'01' +'&end=' + y+'-'+ m +'-'+ d;
                return
            }

                var startTime = $('#start').val();
                var endTime = $('#end').val();
                if (!startTime || !endTime || (startTime > endTime)) {
                    return alert('请选择正确的时间')
                }
                w.location.href = '/forum_admin/donwload?code=' + type + '&start=' + startTime + '&end=' + endTime;
        });

        $('.operating').on('click', '#gbk', function () {
            var type = $(this).attr('data-type');
            var klass = $('.selected').attr('id');
            if (klass == 'week') {
                w.location.href = '/forum_admin/donwload?code='+ type + '&start=0';
                return;
            }
            if (klass == 'month') {
                var date = new Date();
                var y = date.getFullYear();
                var m = date.getMonth();
                var d = getDaysMonth(y, m);
                w.location.href = '/forum_admin/donwload?code=' + type + '&start=' + y+'-' +m +'-' +'01' +'&end=' + y+'-'+ m +'-'+ d;
                return
            }

            var startTime = $('#start').val();
            var endTime = $('#end').val();
            if (!startTime || !endTime || (startTime > endTime)) {
                return alert('请选择正确的时间')
            }
            w.location.href = '/forum_admin/donwload?code=' + type + '&start=' + startTime + '&end=' + endTime;
        });
    })(window, undefined);
</sss>